<template>
    <div>
        <el-row>
            <el-card v-for="item in bloglist" :key="id" class="text item">
                <div slot="header" class="clearfix" @click="toBlogContext(item.blog_id)">
                    <span style="font-weight: bold; font-size: 20px;">{{item.title}}</span>
                    <el-row style="font-size: 15px;">
                        {{item.content}}
                    </el-row>
                </div>
                <el-row class="bottom" style="font-size: 15px;">
                    <el-col v-if="allBlog" :span="8" class="createtime">
                        作者:{{item.owner}}
                    </el-col>
                    <el-col :span="10" class="createtime">
                        创建时间:{{item.create_time}}
                    </el-col>
                    <el-col :span="3">
                        <el-badge :value="item.blog_comment_num" :max="99" class="item">
                            <el-button type="primary" size="small">评论</el-button>
                        </el-badge>
                    </el-col>
                    <el-col :span="3">
                        <el-button size="small">点赞</el-button>
                    </el-col>
                </el-row>
            </el-card>
        </el-row>
        <el-row>
            <el-pagination
                    layout="prev, pager, next"
                    :total="1000">
            </el-pagination>
        </el-row>
    </div>
</template>

<script>
    import POST from "../../api/POST";
    import Cookies from "js-cookie"

    export default {
        name: "bloglist",
        data() {
            return {
                allBlog: true,
                bloglist: [],
                circleUrl: "https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png",
            }
        },
        props:{
            message:String  //接收父组件传过来的值，这是老师id
        },
        methods: {
            toBlogContext(blogId) {
                this.$router.push({path: `/blog/` + blogId + `/blogcontextpage`});
            }
            ,
            getAllBloglist() {
                let data = {};
                POST.blogallShowList(data).then(res => {
                    this.bloglist = res.blog_list
                })
            },
            getBloglistById(id){
                let data = {
                    'account': id,
                };
                POST.blogShowListById(data).then(res => {
                    this.bloglist = res.content
                })
            },
        }
        ,
        mounted() {
            if(this.message===undefined){
                this.getAllBloglist()
            }else{
                this.getBloglistById(this.message);
                this.allBlog = false;
            }
        }
    }
</script>

<style scoped>
    .box-card {
        margin-top: 10px
    }
</style>
